<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<style type="text/css">
			body,
			html {
				width: 100%;
				height: 400px;
				margin: 0;
				font-family: "微软雅黑";
			}
			
			#allmap {
				height: 400px;
				width: 100%;
			}
			
			#r-result {
				width: 100%;
			}
			#h-title{
				font-size: 16px;
				color: #cc5522;
				margin: 0;
			}
			.text-p{
				font-size: 14px;
				color: #666;
			}

			@media screen and (max-width:697px){
				html,#allmap{
					height: 200px;
				}
			}
		</style>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=0SUkmyOFcfeGpiTn4KE3ogm05VKcYsRc"></script>

	</head>

	<body>
		<div id="allmap"></div>
	</body>

</html>
<script type="text/javascript">
	// 百度地图API功能
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	var point = new BMap.Point(116.79536, 39.617673);
	map.centerAndZoom(point, 12);
	var opts = {
		width: 200, // 信息窗口宽度    
		height:60, // 信息窗口高度    
		title: "<h3 id='h-title'>北京欣特锐盾技术发展有限公司</h3>" // 信息窗口标题   
	}
	var infoWindow = new BMap.InfoWindow("<p class='text-p'>北京欣特锐盾技术发展有限公司</p>", opts); // 创建信息窗口对象    
	map.openInfoWindow(infoWindow, map.getCenter()); // 打开信息窗口

	// 创建地址解析器实例
	var myGeo = new BMap.Geocoder();
	// 将地址解析结果显示在地图上,并调整地图视野
	myGeo.getPoint("北京市通州区永乐经济开发区恒业七街6号及6号院22号楼101", function(point) {
		if(point) {
			map.centerAndZoom(point, 16);
			map.addOverlay(new BMap.Marker(point));
		} else {
			alert("您选择地址没有解析到结果!");
		}
	}, "北京市");
</script>